import 'package:flutter/material.dart';

/**
 * 
 * 主轴和副轴的辨识
 * 
    * 在设置对齐方式的时候你会发现右mainAxisAlignment属性，意思就是主轴对齐方式，那什么是主轴，什么又是幅轴那。

    main轴：如果你用column组件，那垂直就是主轴，如果你用Row组件，那水平就是主轴。

    cross轴：cross轴我们称为幅轴，是和主轴垂直的方向。比如Row组件，那垂直就是幅轴，Column组件的幅轴就是水平方向的。

    主轴和幅轴我们搞清楚，才能在实际工作中随心所欲的进行布局。
 * 
 * 
 * 
 * Expanded属性的使用
 * 其实在学习水平布局的时候我们对Expanded有了深刻的理解，它就是灵活布局。比如我们想让中间区域变大，而头部区域和底部根据文字所占空间进行显示。
 *  */

void main() => runApp(myApp());

class myApp extends StatelessWidget{
  @override

  Widget build(BuildContext context){
    return MaterialApp(
      home: Scaffold(
        appBar: new AppBar(
          title: new Text('垂直布局'),
        ),
        body: Column(
          children: <Widget>[
            Center(child: Text('我是大飞')),  //center居中
            Expanded(child: Center(child: Text('我非常的喜欢前端')),), //Expanded灵活的意思
            Center(child: Text('盘他'))
          ],
          crossAxisAlignment: CrossAxisAlignment.start,  //cross副轴 如果是用的是column，副轴代表的是水平方向, 可以啊文字做统一对齐处理
          mainAxisAlignment: MainAxisAlignment.center,  //main 主轴  如果用的是column，主轴代表的是他垂直的方向
        ),
      ),
    );
  }
}